<template>
	<view class="praise" >
		<image v-if="!isPressed" class="praise_img" src="../static/icons/praise_tobe.png" @click="pressPraise"></image>
		<image v-else class="praise_img" src="../static/icons/praise_already.png" @click="pressPraise"></image>
		<i v-if="!isPressed">{{praiseNum}}</i>
		<i v-if="isPressed">{{praiseNum+1}}</i>
	</view>
</template>

<script>
	export default{
		props:["praiseNum","praiseid","type"],
		data(){
			return{
				isPressed:false
				
			}
		},
		methods:{
			pressPraise(){
				this.isPressed=!this.isPressed;
				if(this.isPressed){
					this.addpraise()
				}
				else{
					this.subpraise()
				}
			},
			async addpraise(){				
				await this.$myRequest({
					url:'/'+this.type+'Article/api/addPraise/id='+this.praiseid
				})			
			},
			async subpraise(){
				await this.$myRequest({
					url:'/'+this.type+'Article/api/subPraise/id='+this.praiseid
				})			
			}
		}
	}
</script>

<style lang="less">
	.praise{
		display: flex;
		.praise_img{
			height:32rpx;
			width:32rpx;
		}
		i{
			display: inline-block;
			margin-left:10rpx;
			line-height: 30rpx;
			font-size: 12px;
		}
	}
</style>
